
<div class="wrapper-sm">
  <div class="panel panel-default m-b-n-xs" style="border-radius:5px">
    <div class="panel-body" style="font-size: 10px;padding:5px 20px; " >
      <div class="m-t-xs m-t-sm">
        <span>设备急修</span>
        <i class="fa fa-angle-right"></i>
        <span>客户确认</span>
      </div>
    </div>
  </div>
</div>
<div class="wrapper-sm" style="font-size:12px" *ngIf="data">
  <div class="panel panel-default" style="border-radius:5px">
    <div class="panel-body">
      <div class="m-t-n-xs m-b-md" style="text-align:center;color:white;background-color:#56abe4;line-height:50px;font-size:25px">工单编号：{{orderId}} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span >工单状态：客户确认</span>
      </div>
      <div id="lrzj_x">
        <ul id="timl">
          <li  style="color:orange;background:url('../../../../../assets/img/biggerdot.png') center bottom no-repeat">
            <span>报警</span><br/>
            <span class="icon iconfont icon-jingbaodeng" style="font-size:25px"></span>
          </li>

          <li style="color:orange;background:url('../../../../../assets/img/biggerdot.png') center bottom no-repeat">
            <span>接警</span><br />
            <span class="icon iconfont icon-yijie" style="font-size:25px;"></span>
          </li>

          <li style="color:orange;background:url('../../../../../assets/img/biggerdot.png') center bottom no-repeat">
            <span>到场</span><br />
            <span class="icon iconfont icon-shuniu1" style="font-size:25px;"></span>
          </li>

          <li style="color:orange;background:url('../../../../../assets/img/biggerdot.png') center bottom no-repeat">
            <span>完工</span><br />
            <span class="icon iconfont icon-yiqueren" style="font-size:25px;"></span>
          </li>

          <li style="color:orange;background:url('../../../../../assets/img/biggerdot.png') center bottom no-repeat">
            <span>客户确认</span><br />
            <span class="icon iconfont icon-jiazukehub89d30" style="font-size:25px;"></span>
          </li>
        </ul>

        <div class="m-t-sm">
          <span style="margin-left:80px" *ngFor="let status of data.status">
            {{status.change_time}}
          </span>
          <span style="margin-left:80px">{{time}}</span>
        </div>
        <div class="panel panel-default m-t-md">
          <div class="panel-heading">
            基本信息
          </div>
          <div class="panel-body">
            <div class="m-l-md m-t-sm" style="font-size:14px;color:#23b7e5 "><b>工单信息</b></div>
            <div class="list-group-item ">
              <div class="row">
                <span class="col-sm-6" >工单编号：{{orderId}}</span>

                <span class="col-sm-6" >报警时间：{{data.guzhang.created}}</span>
              </div>
            </div>
            <div class="list-group-item">
              <div class="row">
                <span class="col-sm-6" >报警类型：{{data.guzhang.display_name}}</span>
                <span class="col-sm-6">报&nbsp;&nbsp;&nbsp;警&nbsp;&nbsp;&nbsp;人：{{data.guzhang.bjr}}</span>
              </div>
            </div>
            <div class="list-group-item">
              <div class="row">
                <span class="col-sm-6">问题描述：{{data.guzhang.description}}</span>
              </div>
            </div>



            <div class="m-l-md m-t-sm" style="font-size:14px;color:#23b7e5 "><b>设备信息</b></div>
            <div class="list-group-item ">
              <div class="row">
                        <span class="col-sm-6">

	                        	空压站：{{data.group.name}}

                        </span>
                        <span class="col-sm-6">

	                        	设备编号：{{data.device.mac}}
                        </span>
              </div>
            </div>
            <div class="list-group-item">
              <div class="row">
                <span class="col-sm-6">设备品牌：{{data.device.brand}}</span>
                <span class="col-sm-6">产品名称：{{data.device.product_name}}</span>
              </div>
            </div>
            <div class="list-group-item">
              <div class="row">
                <span class="col-sm-6">设备名称：{{data.device.device_name}}</span>
                <span class="col-sm-6">设备地址：{{data.device.province}}{{data.device.city}}{{data.device.area}}</span>
              </div>
            </div>
            <div class="m-l-md m-t-sm" style="font-size:14px;color:#23b7e5 "><b>维保信息</b></div>
            <div class="list-group-item">
              <div class="row">
                <span class="col-sm-6">空压站联系人：{{data.group.lxr}}</span>
                <span class="col-sm-6">空压站联系人电话：{{data.group.lxdh}}</span>
              </div>
            </div>

            <div class="list-group-item">
              <div class="row">
                <span class="col-sm-6">维保联系人：{{data.wb.nick_name}}</span>
                <span class="col-sm-6">维保联系人电话：{{data.wb.mobile}}</span>
              </div>
            </div>
          </div>

        </div>
        <div class="panel panel-default m-t-sm">
          <div class="panel-heading">
            客户确认
          </div>
          <div class="panel-body">
            <div class="list-group-item">
              <span>确认人：{{username}}</span>
            </div>
            <div class="list-group-item ">
              <span>评分：</span>
              <div class="form-horizontal">
                <div class="form-group" style="margin-bottom:-5px">
                  <label class="col-sm-2 col-sm-offset-2">到场时间</label>
                  <div class="col-sm-8" >
                    <div class="m-b text-lg">
                      <rating [(ngModel)]="rating.daochang" [max]="max"  stateOn="fa fa-star text-warning" stateOff="fa fa-star-o"></rating> <b>({{rating.daochang}}分)</b>
                    </div>
                  </div>
                </div>
                <div class="form-group" style="margin-bottom:-5px">
                  <label class="col-sm-2 col-sm-offset-2" >服务态度</label>
                  <div class="col-sm-8" >
                    <div class="m-b text-lg">
                      <rating [(ngModel)]="rating.servicetime" [max]="max" stateOn="fa fa-star text-warning" stateOff="fa fa-star-o"></rating> <b>({{rating.servicetime}}分)</b>
                    </div>
                  </div>
                </div>
                <div class="form-group" style="margin-bottom:-5px">
                  <label class="col-sm-2 col-sm-offset-2">维修情况</label>
                  <div class="col-sm-8" >
                    <div class="m-b text-lg">
                      <rating [(ngModel)]="rating.repair" [max]="max" stateOn="fa fa-star text-warning" stateOff="fa fa-star-o"></rating> <b>({{rating.repair}}分)</b>
                    </div>
                  </div>
                </div>
              </div>
            </div>

            <div class="list-group-item ">
              <form class="form-horizontal">
                <div class="form-group">
                  <label class="col-sm-2">评价：</label>
                  <div class="m-l-sm">
                    <textarea class="form-control" rows="3" [(ngModel)]="pingjia" name="pinjia"></textarea>
                  </div>
                </div>
              </form>
            </div>

            <div class="list-group-item">
              <div style="text-align:center">
                <a class="btn btn-sm btn-info" (click)="save()">确定</a>
                <a class="btn btn-sm btn-default" (click)="cancel()">返回</a>
              </div>
            </div>


          </div>

        </div>

      </div>



    </div>
  </div>
</div>



